<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>浮动场景1：图片与文字环绕</title>
		<style>
			img{
				/*图片脱离文档流--文字包含在图片周边*/
				float: left;
				margin-right: 50px;/*图片与文字链接处间隙*/
				margin-bottom: 50px;/*图片与文字链接处间隙*/
			}
			p{
				font-size: 16px;/*页面默认字体尺寸*/
				line-height: 20px;/*浮动文字，行高无法设定*/
				word-spacing: 20px;
			}
		</style>
	</head>
	<body>
		<img src="img/3.png" alt="懒羊羊" width="250px" height="250px" />
		<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Quam labore expedita mollitia laboriosam odio delectus, sed eius quos cupiditate optio alias doloremque consequuntur deserunt, inventore culpa in dolore cum ex?Lorem, ipsum dolor sit amet consectetur adipisicing elit. Natus ipsam ullam sequi repellendus vero, amet iste? Fuga quod omnis, commodi iusto, distinctio sequi ea repudiandae, iste numquam nostrum laudantium. Ducimus!</p>
	</body>
</html>